<!-- 报名项目 -->
<template>
	<Layout pagebg="2">
    <fa-navbar :title="title" :border-bottom="false"></fa-navbar>
    <view class="project-list box">
      <view v-for="item in 10" class="item">
        <view class="item-con">
          <view class="name f32">半程马拉松</view>
          <view class="con">
            <view class="intro f24 mb20">备注：先报名后抽签，项目参赛选手限为18岁以上(2007年12月31日前出生)70岁以下(1955年12月31日后出生)</view>
            <view class="flex-bect">
              <text class="color-999">报名费：</text>
              <text class="color-red">￥100.00/人</text>
              <view class="flex-1"></view>
              <view class="btn rd8 bg-primay flex-ct" @click="linkTo">立即报名</view>
            </view>
          </view>
        </view>
      </view>
    </view>
  </Layout>
</template>

<script>
	export default {
		data() {
			return {
        title:'2025阜阳马拉松暨中阜阳马拉松暨中...',
        emptyShow:false,
        canClick:false,
        stepList:[
          {id:1, name:'开始报名', date:'2025-08-15', time:'10:00:00', icon: require('@/home/static/imgs/match-icon1.png')},
          {id:2, name:'报名截止', date:'2025-08-15', time:'10:00:00', icon: require('@/home/static/imgs/match-icon2.png')},
          {id:3, name:'开始比赛', date:'2025-08-15', time:'10:00:00', icon: require('@/home/static/imgs/match-icon3.png')},
          {id:4, name:'比赛结束', date:'2025-08-15', time:'10:00:00', icon: require('@/home/static/imgs/match-icon4.png')}
        ],
        content:"（一）竞赛时间和地点2025年11月16日(星期日)上午08:00在安徽省池州市平天湖莲花台广场举行。（二）竞赛起终点起 点:池州市平天湖莲花台广场;终 点:池州市平天湖莲花台广场(马拉松、半程马拉松);秋浦东路与九华山大道交叉口(欢乐跑)0(三)竞赛项目、组别及参赛规模<br>（一）竞赛时间和地点2025年11月16日(星期日)上午08:00在安徽省池州市平天湖莲花台广场举行。（二）竞赛起终点起 点:池州市平天湖莲花台广场;终 点:池州市平天湖莲花台广场(马拉松、半程马拉松);秋浦东路与九华山大道交叉口(欢乐跑)0(三)竞赛项目、组别及参赛规模<br>（一）竞赛时间和地点2025年11月16日(星期日)上午08:00在安徽省池州市平天湖莲花台广场举行。（二）竞赛起终点起 点:池州市平天湖莲花台广场;终 点:池州市平天湖莲花台广场(马拉松、半程马拉松);秋浦东路与九华山大道交叉口(欢乐跑)0(三)竞赛项目、组别及参赛规模<br>（一）竞赛时间和地点2025年11月16日(星期日)上午08:00在安徽省池州市平天湖莲花台广场举行。（二）竞赛起终点起 点:池州市平天湖莲花台广场;终 点:池州市平天湖莲花台广场(马拉松、半程马拉松);秋浦东路与九华山大道交叉口(欢乐跑)0(三)竞赛项目、组别及参赛规模"
			}
		},
		methods: {
      linkTo(item){
        console.log('进入详情页', item)
        uni.navigateTo({
          url:'/home/match/form'
        })
      }
			
		},
    onPageScroll(e) {
      getApp().setNavFixed(this,e)
    },
    onReachBottom() {
      
    }
	}
</script>

<style lang="scss" scoped>
.project-list{
  .item{
    overflow: hidden; padding: 8rpx;
     margin-bottom: 24rpx;
    .item-con{
      box-shadow: 0rpx 0px 18rpx 0rpx #ddd;background: #ffffff; border-radius: 20rpx; position: relative; 
    }
    .btn{width: 176rpx; height: 60rpx;}
    .name{
      height: 110rpx; border-bottom: 1px dashed #eee; position: relative; padding: 0 26rpx;
      &::after,&::before{content: ''; display: block; width: 30rpx; height: 30rpx; bottom: 0;background-color: #fafafa; box-shadow: 0rpx 0px 18rpx 0rpx #ddd; border-radius: 50%; position: absolute;}
      &::after{right: 0; transform: translate(50%, -50%); }
      &::before{left: 0; transform: translate(-50%, -50%); }
    }
    .con{
      padding: 26rpx;
    }
  }
}
</style>
